<template>
    <!-- 列表商品组件 -->
    <div class="commodity_list"
        :style="{ border: data.checked.length > 0 ? '1px solid #0094FF' : '1px solid transparent' }">
        <div class="list_top" @click="routerGo(type, data.id)">
            <div class="list_top_img">
                <van-image radius="5" :src="data?.productImages ? data?.productImages + '?x-oss-process=image/resize,w_300' : ''" />
                <img src="" alt="">
                <div class="list_top_img_tag" v-if="data?.hmMechanismsList[1]?.cooperationMode">多机制</div>
            </div>
            <div class="list_top_right">
                <div class="list_top_right_title">
                    <div class="title">{{ data?.styleName }}</div>
                    <div class="status" v-if="type == '0'">{{ isAuditStatus(data.auditStatus) }}</div>
                    <div class="status" v-if="type == '1'">{{ isAuditStatus(data.auditStatus) }}</div>
                </div>
                <div class="list_top_right_introduce">{{ data?.sellingPoints }}</div>
                <div class="list_top_right_money">
                    <div class="money_left">
                        <div v-if="data?.hmMechanismsList[0].cooperationMode === '分佣'">
                            ￥<span>{{ data?.hmMechanismsList[0].price }}</span>
                        </div>
                        <div v-else>
                            ￥<span>{{ data?.hmMechanismsList[0].costPrice }}</span>
                        </div>
                        <div v-if="data?.hmMechanismsList[0].cooperationMode === '分佣'" class="commission">
                            <span class="fonts">佣</span>
                            <span class="numbers">
                                {{ data?.hmMechanismsList[0].commission }}%
                            </span>
                        </div>
                    </div>
                    <div class="money_right">
                        {{ data?.hmMechanismsList[0].liveStreamingMechanism }}
                    </div>
                </div>
            </div>
        </div>
        <div class="list_bottom">
            <div class="multiple" v-if="data?.detailedVos.length > 1" @click="SetShowTops(data?.detailedVos)">多人选</div>
            <div class="multiple" v-else>{{ data?.detailedVos[0].selectionCoreName }}</div>
            <div :class="data?.sellStatus == '1' ? 'status_flag' : 'status_flag_active'">合同<van-image
                    :src="data?.sellStatus == '1' ? icon_duihaolvse : icon_wenhaohongse" /></div>
            <div :class="qualificationClass(data)">资审<van-image :src="qualificationReview(data)" /></div>
            <div :class="auditClass(data)">核价<van-image :src="auditReview(data)" /></div>
        </div>
        <div class="checkbox" v-if="switchIndex === '0'">
            <van-checkbox-group v-model="data.checked"
                :disabled="data?.auditStatus !== '6' && data?.auditStatus !== '-5'" style="display: inline-block;">
                <van-checkbox name="code" shape="square"></van-checkbox>
            </van-checkbox-group>
        </div>
    </div>
</template>

<script setup lang="ts">
import { defineProps, defineEmits } from 'vue'
import { useRouter } from 'vue-router';
const icon_duihaolvse = new URL("@/assets/productHome/icon_duihaolvse.png", import.meta.url).href
const icon_wenhaohongse = new URL("@/assets/productHome/icon_wenhaohongse.png", import.meta.url).href
// const icon_xuanzhonglanse = new URL("@/assets/productHome/icon_xuanzhonglanse.png", import.meta.url).href
defineProps({ data: { type: Object, default: () => { } }, switchIndex: { type: String, default: 0 }, type: { type: String, default: '' } })
const emit = defineEmits(['setShowTops'])
const router = useRouter();
/** 资质审核是否审核 */
const qualificationReview = (item: any) => {
    let num = Number(item.auditStatus)
    if (num <= 9) {
        return icon_wenhaohongse
    } else {
        return icon_duihaolvse
    }
}
/** 资质审核class */
const qualificationClass = (item: any) => {
    let num = Number(item.auditStatus)
    if (num <= 9) {
        return 'status_flag_active'
    } else {
        return 'status_flag'
    }
}
/** 核价是否审核 */
const auditReview = (item: any) => {
    let num = Number(item.auditStatus)
    if (num <= 10) {
        return icon_wenhaohongse
    } else {
        return icon_duihaolvse
    }
}
/** 核价class */
const auditClass = (item: any) => {
    let num = Number(item.auditStatus)
    if (num <= 10) {
        return 'status_flag_active'
    } else {
        return 'status_flag'
    }
}
const isAuditStatus = (status) => {
    if (status === '6' || status === '-5') {
        return '待送审'
    } else if (status === '-1') {
        return '已下架'
    } else if (status === '-2') {
        return '已退还'
    } else {
        return '已送审'
    }
}
/** 详情 */
const routerGo = (type: string, productsId: string) => {
    if (type === '0') {
        router.push({
            path: `/productDetail/${productsId}`,
        });
    }
    if (type === '1') {
        router.push({
            path: `/researchProductDetail/${productsId}`,
        });
    }
}

// 打开多人选弹框
const SetShowTops = (data: any) => {
    emit('setShowTops', data)
}

</script>

<style lang="less" scoped>
@import url(@/views/productList/components/style/index.less);
</style>